<template>
	<div>
		<DetailPage
			v-bind="BlockchainConfig"
			:pageRowData="nowRowData"
			:model="baseInfo"
			style="width: 100%; margin: 0 auto"
			:onLoadFormate="onLoadFormate"
		>
			<!-- 修改一下区域 -->
			<template #cr_area_name>
				{{
					baseInfo['crProvinceName'] + baseInfo['crCityName'] + baseInfo['crAreaName'] + baseInfo['crStreetName'] + baseInfo['crCommunityName'] || '/'
				}}
			</template>
		</DetailPage>
		<BolockChainEditRecord
			:isEncrypt="true"
			:code="props.code"
			:nowRowData="props.nowRowData"
			keyName="idCard"
			tableName="dpServiceObject"
		></BolockChainEditRecord>
	</div>
</template>

<script setup lang="ts">
import { getAreaObj } from '@/utils/util'
import DetailPage from '@/views/aplid/DetailPage/index.vue'
import { BlockchainConfig } from './config'
import apiMod from '@/apiMod/index'
import BolockChainEditRecord from '@/components/BolockChainEditRecord/index.vue'
import { xxtea_encrypt } from '@/utils/xxtea.js'

const rowData: any = inject('nowRowData')

type Props = {
	nowRowData?: any
	code?: number
	chainViewInfo?: object
	isBlockchain?: boolean
}
let props = withDefaults(defineProps<Props>(), {
	nowRowData: {},
	code: 1001,
	isBlockchain: false,
})

let baseInfo: any = ref({
	onBlockchainFlag: props.nowRowData.onBlockchainFlag,
})

const getBaseInfo = () => {
	console.log(props.nowRowData)
	let params = {
		key: xxtea_encrypt(props.nowRowData.idCard),
		code: props.code,
	}

	apiMod.view_blockchainBackupGeneral_queryBlockchainInfo(params).then((res) => {
		baseInfo.value = res.data
		baseInfo.value.onBlockchainFlag = props.nowRowData.onBlockchainFlag
	})
}
if (props.isBlockchain) {
	baseInfo.value = props.chainViewInfo
} else {
	getBaseInfo()
}

const onLoadFormate = (data) => {
	data.cr_area_name = getAreaObj(data, 'cr')
	const tableData = data
	return Promise.resolve(Object.freeze(tableData))
}
</script>

<style lang="scss" scoped>
.record_part {
	padding: 20px;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
	.content_part {
		width: 100%;
		display: flex;
		flex-direction: row;
		justify-content: flex-start;
		align-items: flex-start;
		flex-wrap: wrap;
		.desc_part {
			width: 45%;
			margin-bottom: 10px;
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			align-items: center;
			flex-wrap: wrap;
			.prop_part {
				margin: 10px 0;
			}
		}
	}

	.page_part {
		align-self: flex-end;
	}
}
.time_org {
	font-family: 'Microsoft YaHei';
	font-weight: 400;
	font-size: 16px;
	text-align: left;
	color: #000;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	.org_name {
		padding: 2px 4px;
		height: 25px;
		border-radius: 4px;
		background: #fef9eb;
		font-family: 'Microsoft YaHei';
		font-weight: 400;
		font-size: 16px;
		text-align: center;
		color: #ecbb18;
		margin-left: 39px;
	}
}
.edit_user {
	font-family: 'Microsoft YaHei Bold';
	font-weight: 700;
	font-size: 16px;
	text-align: left;
	color: #000000e6;
}
</style>
